export const doFullScreen = (ele: HTMLElement) => {
    if (ele.requestFullscreen) {
        ele.requestFullscreen();
        // @ts-ignore
    } else if (ele.mozRequestFullScreen) { ele.mozRequestFullScreen();
        // @ts-ignore
    } else if (ele.webkitRequestFullscreen) {ele.webkitRequestFullscreen();
        // @ts-ignore
    } else if (ele.msRequestFullscreen) {ele.msRequestFullscreen();
    }
}

export const exitFullScreen = () => {
    // @ts-ignore
    if(document.exitFullScreen) {
        // @ts-ignore
        document.exitFullScreen();
        // @ts-ignore
    } else if(document.mozCancelFullScreen) {
        // @ts-ignore
        document.mozCancelFullScreen();
        // @ts-ignore
    } else if(document.webkitExitFullscreen) {
        // @ts-ignore
        document.webkitExitFullscreen();
        // @ts-ignore
    } else if(element.msExitFullscreen) {
        // @ts-ignore
        element.msExitFullscreen();
    }
}

// @ts-ignore
export const isFullScreen = () => !! ( document.fullscreen || document.mozFullScreen || document.webkitIsFullScreen || document.webkitFullScreen || document.msFullScreen );

export const addFullScreenListener = (listener: (isFullScreenMode: boolean) => void) => {
    const onFullScreen = () => {
        if(isFullScreen()){
            listener(true)
        }else {
            listener(false)
        }
    }

    window.addEventListener("resize", onFullScreen)

    return () => window.removeEventListener("resize", onFullScreen)
}
